<template>
	<view class="noHistory flex" :style="{ '--fss': app.theme.fss() }">
		<image src="/static/img/ic_unbox.png" mode="widthFix" class="icon"></image>
		<view class="desc">{{ text }}</view>
		<view class="btn" @tap="$emit('btnTap')" v-if="btn">{{ btn }}</view>
	</view>
</template>

<script setup>
	import { ref, inject, defineProps } from "vue";
	const app = inject('app');
	
	/* props父组件传参区域 */
	// 接受props
	const prop = defineProps({
		
		// 文案
		text: {
			type: String,
			default: "没有找到记录哦"
		},
		
		// 按钮
		btn: {
			type: String,
			default: "",
		},
		
	});
</script>

<style scoped lang="scss">
	.noHistory{
		flex-direction: column;
		padding: 100rpx 100rpx 130rpx 100rpx;
		align-items: center;
		.icon{
			width: 262rpx;
		}
		.desc{
			line-height: 1.53;
			font-size: calc(24rpx * var(--fss));
			color: rgba(255,255,255,0.5);
			margin-top: 5rpx;
		}
		.btn{
			margin-top: 40rpx;
			line-height: 2.66;
			width: 265rpx;
			font-size: calc(27rpx * var(--fss));
			text-align: center;
			background: #2c2c2c;
			color:#FFF;
			border-radius: 60rpx;
			transition: 0.2s all;
			font-weight:bold;
			&:active{
				opacity: 0.8;
			}
		}
	}
</style>